<!-- HTML5 Playground
File:	communication.html
Author: Nagendra U M
 -->
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<link href="../theme/css/main.css" type="text/css" rel="stylesheet">
	<link href="../theme/css/communication.css" type="text/css" rel="stylesheet">
	<script src="../js/thirdparty/modernizr.min.js" type="text/javascript"></script>
	<script src="../js/thirdparty/jquery-1.7.2.min.js"></script>
	<script src="../js/thirdparty/jquery.timer.js"></script>
	<script src="../js/main.js" type="text/javascript" ></script>
	<script src="../js/communication.js" type="text/javascript" ></script>
	<script src="../js/worker.js" type="text/javascript" ></script>
	<title>HTML5 Playground - Nagendra U M - Realtime/Communication Demo</title>
</head>
<body onload="thingsToDoOnload()">
	<header class="main-header">
		<hgroup>
			<table style="width: 100%">
				<tr>
					<td style="width: 15%;"><img src="../theme/images/html5logo.png"></td>
					<td style="width: 85%; text-align: center;">
						<h1>HTML5 Playground</h1>
						<h3>Realtime/Communication Features</h3>
					</td>
				</tr>
			</table>
		</hgroup>
	</header>
	<nav>
		<ul>
			<li><a href="storage.html">Offline/Storage</a></li>
			<li><a href="communication.html">Realtime/Communication</a></li>
			<li><a href="hardware.html">File/Hardware Access</a></li>
			<li><a href="semantics.html">Semantics and Markup</a></li>
			<li><a href="multimedia.html">Graphics/Multimedia</a></li>
			<li><a href="misc.html">Misc.</a></li>
		</ul>
	</nav>
	<section id="webWorkersDemo">
		<article id="webWorkers">
			<header>
				<h2>Web Workers Demo</h2>
			</header>
			<table class="full-width-table">
				<tr>
					<td>
						<input type="button" id="regularblockingexecbutton" onclick="blockingTick()" value="Regular Blocking Execution" class = "styled-button" />
						<br/><br/>
						<input type="button" id="webworkerexecbutton" onclick="webWorkerTick()" value="Web Worker Execution" class = "styled-button" />
					</td>
					<td style="vertical-align: middle;">
						<span id="ticker" class="startstoptime">0:00</span>
					</td>
				</tr>
			</table>
		</article>
	</section>
	<section id="webSocketsDemo">
		<article id="webSockets">
			<header>
				<h2>WebSockets Demo</h2>
			</header>
			<input type="button" id="launchwebsocketchat" onclick="initializeWebSocketChat()" value="Launch WebSocket Chat App" class = "styled-button" />
			<div id="chatbox"></div>
			<div id="bottomFields">
				<span id="status">Connecting</span>
				<input type="text" id="newmessage" disabled="disabled" />
			</div>
		</article>
	</section>
	<footer>
		<p>&#169; 2012 <a href="http://gplus.to/umnagendra">Nagendra U M</a></p>
		<img alt="Powered by HTML5" src="../theme/images/html5badge.png" title="Powered by HTML5">
	</footer>
</body>
</html>